<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta name="viewport" content="width=device-width" ,initial-scale=1, maximum-scale=1,user-scable=no charset="utf-8" />
		<title>洋盘</title>
		<link rel="stylesheet" type="text/css" href="https://cdnforspeed.oss-cn-beijing.aliyuncs.com/CSS/semantic/semantic.min.css">
		<link rel="stylesheet" type="text/css" href="./css/pageContain.css" />
		<link rel="stylesheet" type="text/css" href="./css/navigateBar.css" />
		<link rel="stylesheet" type="text/css" href="https://cdnforspeed.oss-cn-beijing.aliyuncs.com/CSS/animation/animation.css" />
		<link rel="stylesheet" type="text/css" href="./css/page1.css" />
		<script src="https://cdnforspeed.oss-cn-beijing.aliyuncs.com/JS/fullPage/fullPage.min.js"></script>
		<script src="https://cdnforspeed.oss-cn-beijing.aliyuncs.com/JS/Jquery/JQ3.1.1.js"></script>
		<script src="https://cdnforspeed.oss-cn-beijing.aliyuncs.com/JS/semantic/semantic.min.js"></script>
	</head>

	<body>
		<div id='navigateBar'>
			<div class="navigateBar-logoBox">
				<image class="navigateBar-logoBox-logo" src="images/60x60.png"></image>
				<text class="navigateBar-logoBox-title Colorful-breathing-lamp">不一样的网盘</text>
			</div>

			<!-- <ul class='navigateBar-FnBox'>
				<li class='navigateBar-FnBox-li'>注册</li>
				<li class='navigateBar-FnBox-li'>登录</li>
			</ul> -->
		</div>

		<div id="pageContain">
			<div class="page page1 current">
				<div class="contain">
					<p class="pageTxt animate__animated animate__backInLeft animate__delay-1s">简介</p>
					<div class='contents1'>
						<div class='left-box animate__animated animate__lightSpeedInLeft animate__delay-1s'>
							<div style='color: #007AFF; font-size: 30px;'>qdds</div>
							<h3 class='left-box-title'>洋盘</h3>
							<text>你想要的是一款不限速、不打扰、够安全、易于协作的网盘？这些需求都会被满足，但这样还不够，我们要让你的每一次使用都充满惊喜和愉悦。</text>
						</div>
						<image class="right-img animate__animated animate__backInRight animate__delay-1s" src="https://g.alicdn.com/teambition-site/site/webpack/images/client/app/images/pan/panHeader_3f0896aa6f29b288965df43c49d7c8f6.png"></image>
					</div>
				</div>
			</div>

			<div class="page page2">
				<div class="contain">
					<p class="pageTxt animate__animated animate__flip">文件模块</p>
					<p class='animate__animated animate__slideInDown animate__delay-1s' style="font-size: 30px; text-align: center; margin-top: 80px;">能够满足日常需求的超大存储空间</p>
					<div class='contents2'>

						<div class='contents2-card animate__animated animate__rollIn animate__delay-1s'>
							<image class="contents2-card-img" src='./images/01.png'></image>
							<text class="contents2-card-title">上传下载不限速</text>
							<text style="color: gray;">付不付费，都不限速，因为生产力工具不能让人等待太久。</text>
						</div>
						<div class='contents2-card animate__animated animate__rollIn animate__delay-2s'>
							<image class="contents2-card-img" src='./images/02.png'></image>
							<text class="contents2-card-title">无广告</text>
							<text style="color: gray;">始终是一个优雅安静的地方，没有弹窗或者广告推送。只有当你寻求支持的时候，会发现沟通的入口一直都在那里。</text>
						</div>
						<div class='contents2-card animate__animated animate__rollIn animate__delay-3s'>
							<image class="contents2-card-img" src='./images/03.png'></image>
							<text class="contents2-card-title">隐私绝对安全</text>
							<text style="color: gray;">不会被圈出来问「这是你吗」，尽管安心地存放一切影像资料。我们运用的人工智能技术，只专注于帮助你提升文件管理效率。</text>
						</div>
						<div class='contents2-card animate__animated animate__rollIn animate__delay-4s'>
							<image class="contents2-card-img" src='./images/04.png'></image>
							<text class="contents2-card-title">使用方便</text>
							<text style="color: gray;">分享和收藏东西应该更简单，即便是在未登录状态下，你和小伙伴也可以直接预览或者下载对方发送给你的各类文件。</text>
						</div>
					</div>
				</div>
			</div>






			<div class="page page3">
				<div class="contain">
					<p class="pageTxt animate__animated animate__bounceIn animate__delay-1s">社区模块</p>
					<!-- <p class='animate__animated animate__slideInDown animate__delay-1s' style="font-size: 30px; text-align: center;"></p> -->
					<div class='contents3'>
						<div class='left-box animate__animated animate__rotateInDownRight animate__delay-1s'>
							<image class="left-box-img" src="https://g.alicdn.com/teambition-site/site/webpack/images/client/app/images/pan/audio_9004b9c856a567b6d3bfea7f2199255e.gif"></image>
						</div>
						<div class='right-box animate__animated animate__rotateInDownLeft animate__delay-1s'>
							<p style='font-weight: 600; font-size: 28px;'>不仅存储,还有更有趣的社区空间，你可以和洋盘用户在社区上发布你的瞬间，留下你美好回忆</p>
							<div style="font-size: 20px; margin-top: 20px; color: #336a99;">在你晒出瞬间同时,并发表评论，每个人都能弄清楚讨论的上下文。</div>
						</div>
					</div>
				</div>
			</div>






			<div class="page page4">
				<div class="contain">
					<p class="pageTxt animate__animated animate__fadeInDown animate__delay-1s">聊天模块</p>
				</div>
			</div>





			<div class="page page5">
				<div class="contain">
					<p class="pageTxt animate__animated animate__fadeInDown animate__delay-1s">立即下载</p>
					<div class='contents5'>
						<div class='left-box animate__animated animate__fadeInBottomLeft animate__delay-1s'>
							<p class="pageTxt" style='color: #2185d0bf;'>立即拥有它</p>
							<div style='display: flex; margin-top: 60px;'>
								<div style='display: flex;flex-direction: column; align-items: center;'>
									<div class="ui teal buttons">
										<div class="ui dropdown inverted teal basic button">
											<image src="images/android.png" style="height: 40px;width: 150px;"></image>
											<div class="menu" style='margin-top: 50px; background: transparent;'>
												<div class="item DownLoadNew" data-value="drop" data-txt='Android'>下载最新版</div>
												<div class="item" data-value="horizontal flip" onclick="OnQRCode('Android')">二维码下载</div>
											</div>
										</div>
									</div>

									<div class='tipAndroid-box' style='margin-top: 10px;'>
										<div class="ui tipAndroid" style='text-align: center; padding-top: 10px; font-size: 10px;'>版本号:1.0.27</div>
									</div>
								</div>

								<div style='display: flex;flex-direction: column; align-items: center; margin-left: 20px;'>
									<div class="ui teal buttons">
										<div class="ui dropdown inverted teal basic button">
											<image src="images/ios.png" style="height: 40px;width: 150px;"></image>
											<div class="menu">
												<!-- <div class="item" data-value="drop">下载最新版</div>
												<div class="item" data-value="horizontal flip">二维码下载</div> -->
											</div>
										</div>
									</div>

									<div class='tipIOS-box' style='margin-top: 10px;'>
										<div class="ui tipIOS" style='text-align: center; padding-top: 10px; font-size: 10px;'>版本号:0.0.0(暂未开放)</div>
									</div>
								</div>

								<div style='display: flex;flex-direction: column; align-items: center; margin-left: 20px;'>
									<div class="ui teal buttons">
										<div class="ui dropdown inverted teal basic button">
											<image src="images/PC.png" style="height: 40px;width: 150px;"></image>
											<div class="menu">
												<!-- <div class="item" data-value="drop">下载最新版</div> -->
											</div>
										</div>
									</div>

									<div class='tipPC-box' style='margin-top: 10px;'>
										<div class="ui tipPC" style='text-align: center; padding-top: 10px; font-size: 10px;'>版本号:0.0.0(暂未开放)</div>
									</div>
								</div>

							</div>
						</div>
						<image class='right-img animate__animated animate__fadeInBottomRight animate__delay-1s' src='./images/APPEnter.png'
						 style='margin-right: -90px;'></image>
						<image class='right-img animate__animated animate__fadeInBottomRight animate__delay-1s' src='./images/FileModule.png'></image>
					</div>

				</div>

			</div>


			<div class="page page6">
				<div class="contain">
					<p class="pageTxt animate__animated animate__fadeInDownBig">关于</p>
					<div class='contents6 animate__animated animate__rollIn animate__delay-1s'>
						<p>H5版：<a style='color: skyblue; cursor: pointer;' target="_blank" href='https://static-1d54e049-f81e-427d-a517-62137322ac07.bspapp.com'>https://static-1d54e049-f81e-427d-a517-62137322ac07.bspapp.com</a></p>
						<p>洋盘开源地址：<a style='color: skyblue; cursor: pointer;' target="_blank" href='https://gitee.com/qdds666/YangPan'>https://gitee.com/qdds666/YangPan</a></p>
						<p>作者：秃头洋</p>
						<p>技术栈：HTML+CSS+JS，CSS3+ES6+Ts+Vue，Less+sass，Uniapp+Unicoud+H5Ruantime，原生小程序，Node+Koa+Express+MongoDB+Mysql
							<p>WebGl/Three.js，Git/GitLab，爬虫cheerio/puppeteer</p>
						</p>
						<p>CSDN博客：<a style='color: skyblue; cursor: pointer;' target="_blank" href='https://blog.csdn.net/weixin_44601948'>https://blog.csdn.net/weixin_44601948</a></p>
						<p>个人博客:<a target="_blank" href='https://47.114.114.84:5330/blog/index.html'>秃头洋博客</a></p>
					</div>
					<div class='page6-foot animate__animated animate__slideInUp animate__delay-2s'>
						<div style='display: flex; flex-direction: column; align-items: center;'>
							<p>适龄提示: 本公司产品适合 10 周岁以上玩家使用 未成年人家长监护 隐私政策 侵权投诉</p>
							<p>经营许可证编号: 闽B2-20170322 洋盘网络科技有限公司</p>
							<p>公司地址:龙岩学院</p>
							<p>注册地址:龙岩学院</p>
							<p style='display: flex;align-items: center;'>
								<image src="images/phone.png" style="height: 30px;width: 30px;"></image>
								<span>:15892023484</span>
							</p>
							<p style='display: flex;align-items: center;'>
								<image src="images/email.png" style="height: 30px;width: 30px;"></image>
								<span>:532911513@qq.com</span>
							</p>
						</div>
						<p>Copyright©qdds 洋盘官网 技术支持：秃头洋</p>
					</div>
				</div>
			</div>
		</div>

		<!-- </div> -->

		<ul id="navBar">
			<li>简介</li>
			<li>文件模块</li>
			<li>社区模块</li>
			<li>聊天模块</li>
			<li>立即下载</li>
			<li>关于</li>
		</ul>



		<!-- 拟态框DOM -->
		<div class="ui modal">
			<div></div>
		</div>


	</body>

	<script>
		var runPage;
		runPage = new FullPage({
			id: 'pageContain',
			slideTime: 800,
			effect: {
				transform: {
					translate: 'Y',
					scale: [0, 1],
					rotate: [0, 0]
				},
				opacity: [0, 1]
			},
			mode: 'wheel, touch, nav:navBar',
			easing: 'ease',
			callback: function(index, thisPage) {
				if (index + 1) {
					// 
				}
				// console.log('滚动到了第 ' + (index + 1) + ' 屏');
			}
		});
	</script>







	<script>
		let _init = async () => {
			const Data = null
			let AJAX = function(url, type, data) {
				return new Promise((res, rej) => {
					$.ajax({
						url,
						type,
						dataType: 'json',
						processData: false,
						data: JSON.stringify(data),
						success: (respone) => {
							res(respone)
						},
						fail: (respone) => {
							rej(respone)
						}
					});
				})
			}
			let {data,code} = await AJAX('https://qddscxy-16b8d1.service.tcloudbase.com/YangPan', 'POST', {
				type: "SelNewApk",
				Os: "Android"
			})
			if(code===200){
				let versionDom = document.querySelector('.tipAndroid')
				versionDom.innerText = `版本号:${data.Version}`
			}
			// 悬浮版本号提示
			$('.tipAndroid-box')
				.popup({
					position: 'bottom center',
					target: '.tipAndroid',
					html: data.content
				});
			$('.tipIOS-box')
				.popup({
					position: 'bottom center',
					target: '.tipIOS',
					title: '努力开发中',
					content: ``
				});
			$('.tipPC-box')
				.popup({
					position: 'bottom center',
					target: '.tipPC',
					title: '努力开发中',
					content: ``
				});



			// 下拉选择
			$('.dropdown')
				.dropdown({
					transition: 'drop'
				});

			// 点击下载最新版本
			let DownLoadNew = document.querySelector('.DownLoadNew')
			DownLoadNew.addEventListener('click',function(){
				if(this.dataset.txt ==="Android"){
					window.open(data.DownUrl)
				}
			})
			let OnQRCode = (e) => {
				if (e === 'Android') {
					$('.ui.modal').modal('show');
				}
			}
			// 初始化拟态框
			$('.ui.modal').modal('hide');
		}
		_init()
	</script>
</html>
